

.callout.callout[data-callout=statblocks] {
    --callout-color: var(--accent-rgb);
    --callout-icon: swords;

    --callout-padding: 12px 15px;
    --callout-margin: 10px auto;
    --callout-border-color: var(--hr, var(--hr-color));
    
    border-width: 5px 0 5px 0;
    border-style: solid;
    

    & > .callout-content {
        --heading-spacing-top: 0;
        --heading-spacing-bottom: 0;
        --p-spacing: 7px;
    
        --bold-color: var(--headers, var(--h1-color));
        --hr-icon-symbol: '';
    }
    
    margin: var(--callout-margin);
    min-width: 10ch;
    max-width: 42ch;
    background: transparent;
    box-shadow: 
        var(--shadow-l),
        0 0 20px var(--outline, var(--hr-color));
    
    //Element Styling
    & h1 { width: auto; }
    & img:not([class], [width]) { 
        box-shadow: 0 0 0 4px var(--headers, var(--background-modifier-border)); 
        margin-right: 4px;
        margin-bottom: 4px;
    }

    & h1::after,
    & h1::before,
    & > .callout-title { display: none; }

    & blockquote {         
        --blockquote-border-thickness: 0;
        --blockquote-padding: 5px 0px 2px 0;
        --blockquote-color: var(--soft-text, var(--text-faint));
        --blockquote-background-color: transparent;

        margin-block-start: 0;
        margin-block-end: 0;
    }

    & hr { margin: 12px auto; }
    
    & table {
        --table-header-background: transparent;
        --table-header-background-hover: var(--table-header-background);
        --table-header-color: var(--headers, var(--text-faint));
        --table-header-border-color: transparent;
    
        --table-row-alt-background: transparent;
        --table-row-alt-background-hover: var(--table-row-alt-background);
        --table-row-background-hover: var(--table-row-alt-background);
        --table-column-alt-background: transparent;
        --table-border-color: transparent;
        --table-cell-padding-y: 1px;
        --table-cell-padding-x: 4px;
        --table-header-padding-y: 1px;
        --table-header-padding-x: 4px;
    
        --table-style-column-header-background: transparent;
        --table-style-column-header-bold-weight: var(--text-weight);
        --table-style-column-header-bold-color: var(--text, var(--text-normal));
    
        margin: 12px auto;
        width: unset;
    }


    // Alt Styling
    &[data-callout-metadata~="full"] { max-width: 100%; }
    
    &[data-callout-metadata~="columns"] {
        max-width: 100%;
        
        --columns: 2;
        @for $i from 1 through 9 {
            &[data-callout-metadata~="#{$i}"] { --columns: #{$i}; }
        }

        & > .callout-content {
    
            display: grid;
            grid-template-columns: repeat(var(--columns), 1fr);
            gap: 15px;

            // & > .callout .callout-content { overflow-x: hidden; }
        }
    }




    // Game Styling
    //Dungeons & Dragons
    // &:is(
    //     [data-callout-metadata~=style-dungeonsanddragons],
    //     [data-callout-metadata~=style-dnd]
    // ) {

    // }

}

